<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>配置缓存 - Bibi Setup </title>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css" />
    <link rel="stylesheet" href="assets/css/global.css" />
    <script src="assets/jquery-3.7.1.min.js" ></script>
    <script src="assets/form.js" ></script>
</head>
<body>
    <div class="main-container">
        <div class="main-box">
            <div class="header">
                <div class="logo">
                    <img src="assets/image/logo.svg"  style="width: 28px; height: 28px;" /> 配置缓存
                </div>
                <div id="loading">
                    <div class="spinner-border">
                        <span class="visually-hidden">Loading...</span>
                    </div>
                </div>
            </div>
            <div class="body">
                <div class="content-box">
                    
                    <form>
                        <div id="driver-box"></div>
                        <div id="param-box"></div>
                    </form>
                </div>
                <div class="btn-box">
                    <button class="btn btn-primary" style="width: 80%;" id="main" onclick="save()">保存</button>
                    <button class="btn btn-secondary" style="width: 20%;" id="next" onclick="next()">跳过</button>        
                </div>
                <a href="#" >如何设置更多数据库配置</a>
           </div>      
        </div>
    </div>

    <script>
    var driverList  =  {};
    var currentDriver = '';

    function check(){
        $.ajax({
            url:'work/get-driver.php',
            dataType:"json",
            method:'post',
            data:{
                type:'cache'
            },
            success:function(re){
                $('#loading').hide();
                
                if (re.status == 'error'){
                    alert(re.message);
                    return;
                }

                driverList = re.data;
                let option = [];
                for(let name  in re.data){
                    if(currentDriver=='') currentDriver = name;
                    option.push({
                        value:name,
                        label:name
                    })
                }
                
                //let status = true;
                //if (status) $('#main').attr('disabled',false);
                
                $('#driver-box').html(row('数据库驱动',select('driver',option,currentDriver)));
                
                $('#driver').on('change',function(){
                    currentDriver = $(this).val();
                    changeDriver();
                });

                changeDriver();
            }
        });
    }

    function next(){
        location.href = 'admin.html';
    }

    $(function(){
        check();
    });

    function changeDriver(){
        if (!driverList[currentDriver]) return;

        let items = driverList[currentDriver];
        $('#param-box').html('');

        for(let name in items){
             
            if (items[name]['input']=='input'){
                $('#param-box').append(row(name,input(name,items[name]['default'])));
            }
            
            if (items[name]['input']=='select'){
                $('#param-box').append(row(name,select(name,items[name]['option'],items[name]['default'])));
            }
        }
    }


    function save(){
        
        if (!driverList[currentDriver]) return;

        let items = driverList[currentDriver];
        let data =  {'driver':currentDriver};
        for(let name in items) data[name] = $('#'+name).val();
        $('#loading').show();
        $.ajax({
            url:'work/save-driver.php',
            dataType:"json",
            method:'post',
            data:{type:'cache',driver:currentDriver,data:data},
            success:function(re){
                $('#loading').hide();
                if (re.status == 'success'){
                    alert('保存成功');
                    next();
                }else{
                    alert(re.message);
                } 
            },
            error:function(re){
                $('#loading').hide();
                alert('保存失败');
            }
        });
    }
    
    </script>
</body>

<style>

</style>
</html>